<extend name="Public/base" />
<block name="style">
    <link rel="stylesheet" type="text/css" href="__STATIC__/bootstrap3/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="__STATIC__/FlatUI/css/flat-ui.min.css">
    <link rel="stylesheet" type="text/css" href="__STATIC__/style/style.css">
</block>
<block name="body">

    <body>
        <div class="main">
            <div class="paper">
                <div class="toolbar">
                    <span class="title">业务管理</span>
                </div>
                <div class="divider"></div>
                <div class="body">
                    <div class="content-block">
                        <button type="button" class="btn btn-embossed btn-info " data-toggle="modal" data-target="#addModal">
                        新增
                    </button>
                        <a href="{:U('csv_export',array('csv_name'=>$csv_name))}" class="btn btn-embossed btn-info">
                        csv导出
                    </a>
                    </div>
                    <div class="divider"></div>
                    <div class="table_area content-block">
                        <table class="table table-striped table-bordered">
                            <thead>
                                <tr>
                                    <th>日期</th>
                                    <th>数据</th>
                                    <th>金额</th>
                                    <th>业务</th>
                                    <th>项目</th>
                                    <th>账号</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                <volist name="lists" id="list">
                                    <tr>
                                        <td>{$list.rq}</td>
                                        <td>{$list.sj}</td>
                                        <td>{$list.je}</td>
                                        <td>{$list.yw}</td>
                                        <td>{$list.xm}</td>
                                        <td>{$list.zh}</td>
                                        <td><button type="button" class="btn btn-info btn-sm btn-embossed updatebtn" data-id="{$list.id}">编辑</button>
                                            <a type="button" class="btn btn-danger btn-sm btn-embossed" href="{:U('del',array('id'=>$list['id']))}">删除</a>
                                        </td>
                                    </tr>
                                </volist>
                            </tbody>
                        </table>

                    </div>
                </div>
            </div>
        </div>
        <!-- Modal -->
        <div class="modal fade" id="addModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h6 class="modal-title" id="myModalLabel">新增报表</h6>
                    </div>
                    <div class="modal-body">
                        <form id="add_form" class="form-horizontal public_form" action="{:U('add')}" method="post">
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">项目id</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="{$xm_id}" name="xm_id" readonly="readonly">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">日期</label>
                                <div class="col-lg-4">
                                    <input type="text" id="form_date" class="form-control form_date" value="" data-date-format="yyyy-mm-dd" name="rq">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">数据</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="" name="sj" >
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">项目</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="{$xm}" name="xm" readonly="readonly">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">业务</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="{$yw}" name="yw" readonly="readonly">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">账号</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="{$zh}" name="zh" readonly="readonly">
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default btn-embossed" data-dismiss="modal">关闭</button>
                        <button type="button" id="addbtn" class="btn btn-primary btn-embossed">保存</button>
                    </div>
                </div>
            </div>
        </div>

        <!-- Modal -->
        <div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h6 class="modal-title" id="myModalLabel">编辑报表</h6>
                    </div>
                    <div class="modal-body">
                        <form id="update_form" class="form-horizontal public_form" action="{:U('edit')}" method="post">
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">项目id</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="" name="xm_id" readonly="readonly">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">日期</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" name="rq" readonly="readonly">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">数据</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="sj" name="sj">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">项目</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="" name="xm" readonly="readonly">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">业务</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="" name="yw" readonly="readonly">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="exampleInput" class="col-lg-2 control-label">账号</label>
                                <div class="col-lg-4">
                                    <input type="text" class="form-control" value="" name="zh" readonly="readonly">
                                </div>
                            </div>
                            <input type="hidden" class="form-control" value="" name="id">
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default btn-embossed" data-dismiss="modal">关闭</button>
                        <button type="button" id="savetn" class="btn btn-primary btn-embossed">保存</button>
                    </div>
                </div>
            </div>
        </div>
    </body>
</block>
<block name="script">
    <script type="text/javascript" src="__STATIC__/FlatUI/js/flat-ui.min.js"></script>
    <script type="text/javascript" src="__STATIC__/FlatUI/js/application.js"></script>
    <script type="text/javascript" src="__STATIC__/bootstrapValidator.min.js"></script>
    <script type="text/javascript" src="__STATIC__/moment.js"></script>
    <script type="text/javascript" src="__STATIC__/validator.js"></script>
    <script src="http://www.css88.com/doc/underscore1.8.2/underscore-min.js"></script>
    <script>
        // 日期插件加载
        $('.form_date,.find_date').datetimepicker({
            language: 'zh-CN',
            format: 'yyyy-mm-dd',
            weekStart: 1,
            todayBtn: 1,
            autoclose: 1,
            todayHighlight: 1,
            startView: 2,
            minView: 2,
            forceParse: 0
        });

        $(".public_form").submit(function (ev) {
            ev.preventDefault();
        });

        $("#addbtn").on("click", function () {
            var that = this;
            var bootstrapValidator = $("#add_form").data('bootstrapValidator');
            bootstrapValidator.validate();
            if (bootstrapValidator.isValid()) {
                $("#add_form")[0].submit();
                $(this).attr("disabled", "true"); //设置变灰按钮  
            } else {
                return;
            }
            setTimeout(function () {
                $(that).removeAttr('disabled')
            }, 3000);
        })
        $("#savetn").on("click", function () {
            $(this).attr("disabled", "true"); //设置变灰按钮  
            var bootstrapValidator = $("#update_form").data('bootstrapValidator');
            bootstrapValidator.validate();
            if (bootstrapValidator.isValid()) {
                $("#update_form")[0].submit();
            } else {
                return;
            }
            setTimeout(function () {
                $(that).removeAttr('disabled')
            }, 3000);
        })
        $('.modal').on('hidden.bs.modal', function (e) {
            $(".public_form")[0].reset();
            $(".public_form").data('bootstrapValidator').destroy();
            $('.public_form').data('bootstrapValidator', null);
            validator();
        })
        $('.modal').on('show.bs.modal', function (e) {
            var newdate = moment($(".table>tbody>tr:first-child>td:first-child").html()).add(1, 'days').format(
                "YYYY-MM-DD");
            $(".form_date").val(newdate)
            $(".form_date").datetimepicker('update');
        })

        $(".updatebtn").on("click", function (e) {
            e.stopPropagation();
            var id = $(this).attr("data-id");
            $.ajax({
                url: "{:U('edit')}",
                type: 'GET', //GET
                data: {
                    id: id
                },
                success: function (data) {
                    $("#update_form .form-control").each(function (index, val) {
                        var self = this;
                        for (x in data) {
                            if ($(self).attr("name") == x) {
                                $(self).val(data[x]);
                            }
                        }
                    });
                },
                async: false,
            })
            $('#updateModal').modal();
        })

        $("#form_date").keyup(
            _.debounce(
                function () {
                    var year = moment().year();
                    var str = $(this).val();
                    var arr = str.split("/")
                    if (arr.length > 1) {
                        arr[0] = arr[0] - 1;
                        arr.unshift(year)
                        var fulldate = moment(arr).format("YYYY-MM-DD");
                        if (fulldate != "Invalid date") {
                            $(".form_date").datetimepicker('update', fulldate);
                        }
                    }
                },
                // 这是我们为用户停止输入等待的毫秒数
                1000
            ))
    </script>
</block>